<template>
	<view class="content" style="background-color: #fff;">
		<u-navbar scrollable=false titleStyle="font-size:40rpx;color:#333" :placeholder='true' :title="status==2?'企业认证成功':status==0?'填写信息':status==1?'企业认证中':status=='2'?'企业认证未通过':'认证信息'"
			:autoBack="true">
		</u-navbar>
		<view class="container">
			<!-- <view class="li" style="border-bottom: none;display: initial;"> -->
				<view class='co3 fontS32 fw7' :style="{marginBottom:status==3?'24rpx':''}">营业执照上传</view>
				 <view class="co3 fontS24 fw7 flex" v-if='status==0' style='margin:4rpx auto 24rpx;align-items: flex-start;'>
				 	上传将自动识别公司信息 <image src="/static/images/mine/Vector.png" mode="" style="width: 12rpx;height: 12rpx;"></image>
				 </view>
			<!-- </view> -->
			<view class="" @click="upImg"> 
				<image src="../../static/images/Group 33508.png" mode=""  v-if="image.length==0" style='width: 343px;height: 170px;' ></image>
				<view class="" v-for="(item,index) in  image"  v-else>
					<image :src="item"   style="width: 343px;height: 170px;border-radius:10rpx;" mode="aspectFill">
					</image> 
				</view>
			</view>
			
			<view class="li">
				<view class="flex" style="width: 50%;">
					<text>电子邮箱</text>
				</view>
				<input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;flex: 1" v-model="email" placeholder="请输入联系邮箱" :disabled="status==1 ||  status==3"></input>
			</view>
			<view class="li">
				<view class="" style="width: 50%;">
					<text>手机号码</text>
				</view>
				<input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;flex: 1;"  v-model="mobile" placeholder="请输入手机号码":disabled="status==1 ||  status==3" type="number"></input>
			</view>
			<view class="li">
				<view class="flex" style="width:20%">
					<text>公司名称</text>
				</view>
				<input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;flex: 1" v-model="company_name"
					placeholder="请输入营业执照的公司名称" :disabled="status==1 ||  status==3"></input>
			</view> 
			<view class="li">
				<view class="flex" style="width:20%">
					<text>公司税号</text>
				</view>
				<input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;flex: 1" v-model="company_number" placeholder="请输入公司税号" :disabled="status==1 ||  status==3"></input>
			</view>
			<view class="li">
				<view class="flex" style="width: 50%;">
					<text>公司法人</text>
				</view>
				<input class="fontS32" placeholder="请输入公司法人" style="text-align: right; height: 100%;font-weight: 400;flex: 1" v-model="company_legal" :disabled="status==1 ||  status==3">
			</view>
			<view class="li" style='display: initial;'>
				<view class="flex" style="width: 20%;">
					<text>公司地址</text>
				</view> 
				<u-textarea :disabled="status==1 ||  status==3" confirmType='done' autoHeight :placeholderStyle="{fontSize: '32rpx',color: '#999999'}  "id="" cols="30" rows="10" v-model="company_addr"  style='min-height: 101rpx;border: 1rpx solid #f5f5f5;color: #333;font-weight:400;' placeholder="请输入公司地址" ></u-textarea>
			</view>
		</view>
		<view class="refundBox" v-if='status==2'>
			<view class="box"></view>
			<view class="box1">
				<view class="fontS32 co3 fw7">
					拒绝原因
				</view>
				<view class="" style='margin-top:12rpx;min-height: 100rpx;'>
					未查到此公司！
				</view>
			</view>
		</view>
		 <!-- v-if='status!=3' -->
		<view class="btn"  v-if='status!=3'  >
			<u-button :loading="loading" @click="store" class="submit" v-if="status==0 || status=='2'">{{status==2?'重新申请':'确认提交'}}</u-button>
			<u-button :loading="loading"  class="submit1" v-else>{{status==1?'入驻中，等待审核':status==3?'已认证':''}}</u-button>
			<view class="flex" style="margin: 20rpx auto;align-items: flex-start;justify-content: center;">
				<view class="radio1 center" @click="isagreen=!isagreen" >
					<u-icon name='checkbox-mark' color="#DD2131" size="26rpx" v-if="isagreen" ></u-icon>
				</view>
				<view class=" " style='width: 250px;line-height: 40rpx;'>
					<view class="fontS24" > 
						<text>创建网站账号的同时：我同意遵守</text>
						<text class="homeRed" @click="$my.go('/pages/my/privacyAndAgreements?type=7')" style="text-decoration: underline;">奈喜会员协议</text>
						<text>-愿意接收相关来自奈喜的会员及服务邮件</text>
					</view>
				</view>
			</view>
		</view>
	</view> 
</template> 



<script>
	export default {
		data() {
			return {
				isagreen:false,
				status:0,//  0未认证1认证中2已拒绝3成功
				loading: false,
				mobile: '',
				company_name: "",
				company_addr: '', 
				company_legal: '', 
				company_number: '',
				email: '', //邮箱
				image: [], //图片 
			}
		},
		onLoad(option) {
			this.$my.post('/index/Business/findBuiness',).then(res=>{
				if(res.code==200 && res.data.company_name){
					let data = res.data
					this.mobile= data.mobile
					this.company_name= data.company_name
					this.company_addr= data.company_addr
					this.company_legal= data.company_legal
					this.company_number= data.company_number
					this.email= data.email //邮箱
					this.image[0]= data.business_image //图片
					this.status= data.status //邮箱
				}
			})
		},
		methods: {
			
			clickImg() {
				uni.previewImage({
					urls:this.image, //需要预览的图片http链接列表，多张的时候，url直接写在后面就行了
					current: this.image[0], // 当前显示图片的http链接，默认是第一个
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {},
				})
			},
			upImg() {
				if(this.status==1 || this.status==3) return
				let _this=this;
				uni.chooseImage({
					count: 9, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['camera '], //手机拍照
					success: (res) => {
						uni.showLoading({
							title:'上传中'
						})
						const tempFilePaths = res.tempFilePaths;
						tempFilePaths.forEach(item => {
							uni.uploadFile({
								url: this.$my.url + '/index/com/file',
								filePath: item,
								name: 'file',
								header: {
									"Accept-Language": uni.getStorageSync('locale') ?
										uni.getStorageSync('locale') : 'zh',
									'token': uni.getStorageSync('token'),
								},
								formData: {
									"file": tempFilePaths[0],
									use: 'company_photo'
								},
								success: (uploadFileRes) => {
									uni.hideLoading()
									let res = JSON.parse(uploadFileRes.data);
									if (res.code == 200) {
										 this.image[0]=res.data.file_path
										this.$my.post('/index/Business/qrcode',{business_image:res.data.file_path}).then(res=>{
											if(res.code==200 && res.data){
												let data = res.data
												this.company_name= data.companyName
												this.company_addr= data.businessAddress
												this.company_legal= data.legalPerson
												this.company_number= data.creditCode
											}else{
												_this.$my.toast('营业执照识别失败')
											}
										})
									} else {
										_this.$my.toast(res.meaasge)
									}
								},fail() {
									uni.hideLoading()
								}
							});
						})
					}
				});
			},
			// 删除图片
			del(index) {
				this.image.splice(index, 1)
			},
			// 添加
			store() {
				if(!this.isagreen){
					this.$my.toast('请同意会员协议')
					return
				}
				this.loading = true
				
				this.$my.post('/index/Business/addBusiness', {
					email: this.email,
					mobile: this.mobile,
					company_name: this.company_name,
					company_addr: this.company_addr,
					business_image: this.image[0],
					company_legal: this.company_legal,
					company_number: this.company_number,
				}).then(res => {
					this.loading = false
					if (res.code == 200) {
						// 获取用户个人信息
							this.$my.get('/index/user/get_user_info').then(res=>{
								if(res.code==200){
									uni.setStorageSync('userInfo',res.data)
									this.$store.commit('changecompany_status',res.data.company_status)
									this.$my.go('/myPackageA/certification/success')
								} 
							})
					}else{
						this.$my.toast(res.message)
					}
				})
			},
		},
	}
</script>

<style lang="scss" scoped>
	/deep/.u-textarea--disabled{
		background: none !important;
	}
	.refundBox{
		// padding: 24rpx 32rpx;
		// box-sizing: border-box;
		.box{
			background-color: #F5F5F5;
			height: 24rpx;
		}
		.box1{
			padding: 24rpx 32rpx;
			box-sizing: border-box;
			
		}
	}
	.radio1{
		width:26rpx;
		height:26rpx;
		padding-top:-10rpx;
		box-sizing: border-box;
		// line-height: 30rpx;
		// text-align: center;
		border: 4rpx solid #999999;
		border-radius: 50%; 
		margin-top: 5rpx;
		margin-right: 4rpx;
		// float: left;
	}
	.content {
		.iamgbox {
			width: 280rpx;
			height: 140rpx;
			text-align: center;
			display: flex;
			border-radius: 8rpx;
			padding: 32rpx 0;
			background: #F5F5F5;
			box-sizing: border-box;
		}

		// border: 2rpx solid #f5f5f5;
		.container {
			padding:0 4% 20rpx;

			>.li {
				height: 100rpx;
				border-bottom: 2rpx solid #f3f3f3;
				line-height: 100rpx;
				font-size: 32rpx;
				display: flex;
				justify-content: space-between;
				font-weight: bold;

				.fw4 {
					font-weight: 400;
				}
			}
		}

		.btn {
			background-color: #f5f5f5;
			padding: 40rpx 0;
			
			.submit {
				width: 92%;
				background-color: #DD2131;
				border-radius: 45rpx;
				color: white;
			}
			.submit1{
				width: 92%;
				background-color: #ccc !important;
				border-radius: 45rpx;
				color: white;
			}
		}

	}
</style>
